{include file="common/head"/}
<style>

    .ens{
        cursor: pointer;
        float: left;
        margin-top: 15px;
        margin-right: 44px;
    }
    .icon-ls{
        display: inline-block;
        border: 1px solid #ccc;
        width: 25px;
        height: 25px;
        text-align: center;
        line-height: 25px;
        color: #fff;
        /* font-size: 18px; */
        font-weight: bold;
    }
    .icon-ls-act{
        background-color: #1aa094;
    }
</style>
<div class="admin-main layui-anim layui-anim-upbit">
    <fieldset class="layui-elem-field layui-field-title">
        <legend>接单列表</legend>
    </fieldset>
    <div class="demoTable">
        <a href="javascript:history.back(-1);" class="layui-btn layui-btn-normal">返回</a>
        <div class="layui-inline">
            <input class="layui-input" name="key" id="key" placeholder="{:lang('pleaseEnter')}编号或关键字">
        </div>
        <button class="layui-btn" id="search" data-type="reload">{:lang('search')}</button>
        <!--<a href="{:url('queryPage')}" class="layui-btn">显示全部</a>-->
        <!-- <button type="button" class="layui-btn layui-btn-danger" id="delAll">批量关闭</button>-->

        <button type="button" class="layui-btn" id="add">创建派单任务</button>

    </div>

    <table class="layui-table" id="list" lay-filter="list"></table>
</div>
{include file="common/foot"/}
<script type="text/html" id="option">

    {{# if(d.state_id==20 && gid==5 && d.is_me==0){ }}



    {{# }else if(d.state_id==22 && gid==5){  }}

    <a class="layui-btn layui-btn-xs" lay-event="rece" >接单</a>
    <a class="layui-btn layui-btn-warm layui-btn-xs" lay-event="refu" >拒单</a>


    {{# }else if(d.state_id==23 && gid==5){  }}
    <a class="layui-btn layui-btn-warm layui-btn-xs" lay-event="refu_info" >拒单原因</a>

    {{# }else if(d.state_id==21 && gid==5){  }}

    <!--<a class="layui-btn layui-btn-xs" lay-event="team" >组建团队</a>-->
    <a class="layui-btn layui-btn-xs" lay-event="teams" lay-team="1">团队人员</a>

    {{# }else if(d.state_id==25 && gid==5){  }}


    <a class="layui-btn layui-btn-xs" lay-event="teams" lay-team="1">团队人员</a>

    {{# }else{  }}

    {{# } }}

    {{# if(d.state_id==25){ }}
    <a class="layui-btn layui-btn-xs" lay-event="track" >跟踪状态</a>
    {{# } }}

    <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="info" >查看详情</a>

</script>

<script type="text/html" id="state">
    {{# if(d.state_id==23){ }}
    <span style="color: red">({{d.username}}){{d.state_name}}</span>
    {{# }else{  }}
    <span>{{d.state_name}}</span>
    {{# } }}
</script>

<script type="text/html" id="comp">
    {{# if(d.is_comp==1){ }}
        任务结束
    {{# }else{  }}
        任务进行中
    {{# } }}
</script>

<script>
    let aid = '{:session("aid")}';
    var gid = '{:session("gid")}';
    var wh = {state_id:'20,21,22,23,25'};
    wh.admin_id = '{:session("aid")}';

    layui.use('table', function() {
        var table = layui.table, $ = layui.jquery;
        var tableIn = table.render({
            id: 'works',
            elem: '#list',
            url: '{:url("queryPage")}',
            method: 'post',
            where:wh,
            page: true,
            cols: [[
                {checkbox: true, fixed: true},
                {field: 'id', title: 'ID', width: 80,fixed: true},
                {field: 'title', title: '标题', width: 180},
                {field: 'tel', title: '{:lang("tel")}', width: 150},
                {field: 'desc', title: '描述', width: 300},
                {field: 'address', title: '地址', width: 150},
                /*{field: 'type_name', title: '类型', width: 120},*/
                {field: 'fault_name', title: '故障类型', width: 150},
                {field: 'state_name', title: '状态', width: 150,toolbar:'#state'},
                {field: 'is_comp', title: '完成', width: 120,toolbar:'#comp'},
                {width: 230, align: 'center', toolbar: '#option'}
            ]],
            limit: 10 //每页默认显示的数量
        });
        if(gid != '5'){
            $('#add').hide();
        }
        //搜索
        $('#search').on('click', function () {
            var key = $('#key').val();
            if ($.trim(key) === '') {
                layer.msg('{:lang("pleaseEnter")}关键字！', {icon: 0});
                return;
            }
            var ck = wh;
            ck.key = key;
            tableIn.reload({
                where: ck
            });
        });
        table.on('tool(list)', function(obj) {
            var data = obj.data;
            if (obj.event === 'dis') {

            }else if(obj.event === 'me'){
                $.post('{:url("Person/query")}',{gid:5},function (udata) {

                    var str = '<div id="eng" style="line-height: 45px;font-size: 17px;"><span>工程师：</span>' +
                        '<select name="aid" id="aid" style="padding: 5px 15px;">';

                    $.each(udata.data,function (k,v) {
                        str += '<option value="'+v.admin_id+'">'+v.username+'</option>';
                    });

                    str +='</select>'+
                        '</div>';
                    layer.confirm('您确定要派单给平台工程师吗？'+str, function(index){

                        var aid = $('#aid').val();

                        if(aid.length<=0) {
                            layer.msg('请选择工程师',{icon:5});
                            return;
                        }

                        var loading = layer.load(1, {shade: [0.1, '#fff']});
                        $.post("{:url('dis')}",{id:data.id,aid:aid},function(res){
                            layer.close(loading);
                            if(res.code===1){
                                layer.msg(res.msg,{time:1000,icon:1});
                                tableIn.reload();
                            }else{
                                layer.msg(res.msg,{time:1000,icon:2});
                            }
                        });
                        layer.close(index);
                    });
                });
            }
            else if(obj.event == 'rece'){
                //接单
                layer.confirm('您确定要接单吗？', function(index){

                    var loading = layer.load(1, {shade: [0.1, '#fff']});
                    $.post("{:url('confMe')}",{id:data.id},function(res){
                        layer.close(loading);
                        if(res.code===1){
                            layer.msg(res.msg,{time:1000,icon:1});
                            tableIn.reload();
                        }else{
                            layer.msg(res.msg,{time:1000,icon:2});
                        }
                    });
                    layer.close(index);
                });
            }
            else if(obj.event == 'refu'){
                //拒单
                layer.prompt({
                    formType: 2,
                    value: '',
                    title: '请输入拒绝原因',
                    area: ['500px', '250px'] //自定义文本域宽高
                }, function(value, index, elem){

                    if(value.length<=0){
                        layer.msg('请输入原因',{icon:5});
                        return;
                    }

                    var loading = layer.load(1, {shade: [0.1, '#fff']});
                    $.post("{:url('refusal')}",{id:data.id,val:value},function(res){
                        layer.close(loading);
                        if(res.code===1){
                            layer.msg(res.msg,{time:1000,icon:1});
                            tableIn.reload();
                        }else{
                            layer.msg(res.msg,{time:1000,icon:2});
                        }
                    });

                    layer.close(index);
                });
            }
            else if(obj.event == 'refu_info'){
                //拒绝原因
                layer.open({
                    title: '拒绝原因'
                    ,content: data.reason
                });
            }
            else if(obj.event == 'info'){
                //查看详情
                var str = '<table class="layui-table">';

                str+=   '<tr>' +
                    '<th>标题</th>'+
                    '<td>'+data.title+'</td>'+
                    '</tr>';
                str+=   '<tr>' +
                    '<th>电话</th>'+
                    '<td>'+data.tel+'</td>'+
                    '</tr>';

                str+=   '<tr>' +
                    '<th>地址</th>'+
                    '<td>'+data.address+'</td>'+
                    '</tr>';

                str+=   '<tr>' +
                    '<th>故障类型</th>'+
                    '<td>'+data.fault_name+'</td>'+
                    '</tr>';
                str+=   '<tr>' +
                    '<th>描述</th>'+
                    '<td>'+data.desc+'</td>'+
                    '</tr>';
                str+=   '<tr>' +
                    '<th>创建时间</th>'+
                    '<td>'+data.c_time+'</td>'+
                    '</tr>';
                if(data.ticket.length>0){
                    let term = new Array();
                    term = data.ticket.split(';');
                    let asc = '';
                    for(let i=0;i<term.length;i++){
                        asc += '<a href="'+term[i]+'" target="_blank" style="color: blue">文件'+(i+1)+'</a>';
                    }
                    str+=   '<tr>' +
                        '<th>工作票</th>'+
                        '<td>'+
                        asc
                        +'</td>'+
                        '</tr>';
                }
                var att1 = '';
                var att2 = '';
                if(data.w_attach&&data.w_attach.length>0){
                    att1 = '<a href="/public'+data.w_attach+'" target="_blank" style="color: blue">附件1</a>';
                }
                if(data.attach&&data.attach.length>0){
                    att2 = '  <a href="/public'+data.attach+'" target="_blank" style="color: blue">附件2</a>';
                }
                str+=   '<tr>' +
                    '<th>附件</th>'+
                    '<td>'+att1+att2+'</td>'+
                    '</tr>';
                if(data.state_id==23){
                    str+=   '<tr>' +
                        '<th>拒单原因</th>'+
                        '<td>('+data.username+')'+data.reason+'</td>'+
                        '</tr>';
                }
                if(data.arge.length>0){
                    let term = new Array();
                    term = data.arge.split(';');
                    let asc = '';
                    for(let i=0;i<term.length;i++){
                        asc += '<a href="'+term[i]+'" target="_blank" style="color: blue">文件'+(i+1)+'</a>';
                    }
                    str+=   '<tr>' +
                        '<th>完成协议单</th>'+
                        '<td>'+asc+'</td>'+
                        '</tr>';
                }
                str += '</table>';
                layer.open({
                    title:'详情',
                    area:['540px','460px'],
                    content:str,
                });
            }
            else if(obj.event == 'team'){
                //组建团队
                $.post('{:url("Engin/query")}',{is_part:0,gid:'5'},function (dal) {
                    var str = '<div id="enList" style="margin-left: 20px;">';
                    str += '<ul class="ps">';
                    //icon-ls-act
                    $.each(dal.data,function(k,v){
                        if(v.admin_id != aid)
                        str += '<li class="ens" aid="'+v.admin_id+'" isc="0" at="'+v.is_at+'"><span class="icon-ls"><i class="layui-icon layui-icon-ok"></i></span><span>'+v.jobs_title+'：</span><span style="font-size: 16px;">'+v.username+'</span><span style="color: #5fb878">('+(v.is_at==0?'空闲':'工作中')+')</span></li>';
                    });

                    str += '</ul>';
                    str += '</div>';

                    layer.open({
                        title:'组建团队',
                        type:1,
                        area:['540px','460px'],
                        btn:['提交','取消'],
                        content:str,
                        yes:function (index) {
                            var ids = '';
                            $('.ens[isc=1]').each(function () {
                                ids += $(this).attr('aid')+',';
                            });
                            if(ids.length<=0){
                                layer.msg('请选择人员',{icon:5});
                                return;
                            }
                            var loading = layer.load(1, {shade: [0.1, '#fff']});
                            $.post('{:url("team")}',{dis_id:data.id,aid:ids},function (res) {
                                layer.close(loading);
                                if(res.code===1){
                                    layer.msg(res.msg,{time:1000,icon:1});
                                    tableIn.reload();
                                }else{
                                    layer.msg(res.msg,{time:1000,icon:2});
                                }
                                layer.close(index);
                            });
                        },
                        success:function (lay,index) {
                            $('.ens').click(function(){
                                var at = $(this).attr('at');
                                if(at=='1'){
                                    layer.msg('该人员正在工作中！',{icon:5});
                                    return;
                                }
                                var isc = $(this).attr('isc');
                                var aid = $(this).attr('aid');
                                if(isc=='0'){
                                    $(this).attr('isc','1');
                                    $(this).find('.icon-ls').addClass('icon-ls-act');
                                }else{
                                    $(this).attr('isc','0');
                                    $(this).find('.icon-ls').removeClass('icon-ls-act');
                                }
                            });
                        }
                    });
                });
            }
            else if(obj.event == 'teams'){

                //团队人员
                var loading = layer.load(1, {shade: [0.1, '#fff']});
                $.post('{:url("teamList")}',{dis_id:data.id},function (re) {
                    layer.close(loading);

                    var str = '';

                    str += '<div style="border-bottom: 1px solid #ccc;line-height: 45px;padding-left: 20px;"><button class="layui-btn layui-btn-sm" id="addtr">' +
                        '  <i class="layui-icon">&#xe608;</i> 添加人员' +
                        '</button></div>';

                    str += '<table class="layui-table" style="width: 96%;margin-left: 10px;">';

                    $.each(re.data,function (k,v) {
                        str+=   '<tr>' +
                            '<th>'+v.jobs_title+'</th>'+
                            '<td>'+(v.is_lead==1?v.username+'<span style="color: #00B83F">(领队)</span>':v.name)+'</td>'+
                            '<td>' +
                            (v.admin_id!=aid?'<a class="layui-btn layui-btn-sm moves" aid="'+v.admin_id+'" did="'+data.id+'">移除</a>':'') +
                            '</td>'+
                            '</tr>';
                    });

                    str += '</table>';
                    layer.open({
                        title:'团队人员',
                        type:1,
                        area:['540px','460px'],
                        btn:['关闭'],
                        content:str,
                        success:function (lay,index) {
                            $('#addtr').click(function () {
                                $.post('{:url("Engin/query")}',{is_part:0,gid:'5'},function (dal) {
                                    var str = '<div id="enList" style="margin-left: 20px;">';
                                    str += '<ul class="ps">';
                                    //icon-ls-act
                                    $.each(dal.data, function (k, v) {
                                        if(!sea(re.data,v.admin_id)){
                                            str += '<li class="ens" aid="' + v.admin_id + '" isc="0" at="'+v.is_at+'"><span class="icon-ls"><i class="layui-icon layui-icon-ok"></i></span><span>' + v.jobs_title + '：</span><span style="font-size: 16px;">' + v.name + '</span><span style="color: #5fb878">(' + (v.is_at == 0 ? '空闲' : '工作中') + ')</span></li>';
                                        }
                                    });

                                    str += '</ul>';
                                    str += '</div>';

                                    layer.open({
                                        title: '添加队员',
                                        type: 1,
                                        tipsMore: true,
                                        area: ['540px', '460px'],
                                        btn: ['提交', '取消'],
                                        content: str,
                                        yes: function (index2) {
                                            var ids = '';
                                            $('.ens[isc=1]').each(function () {
                                                ids += $(this).attr('aid') + ',';
                                            });
                                            if (ids.length <= 0) {
                                                layer.msg('请选择人员', {icon: 5});
                                                return;
                                            }

                                            var loading = layer.load(1, {shade: [0.1, '#fff']});

                                            $.post('{:url("addTeam")}', {dis_id: data.id, aid: ids}, function (res) {
                                                layer.close(loading);
                                                if (res.code === 1) {
                                                    layer.msg(res.msg, {time: 1000, icon: 1});
                                                    tableIn.reload();
                                                } else {
                                                    layer.msg(res.msg, {time: 1000, icon: 2});
                                                }
                                                layer.close(index2);
                                                layer.close(index);
                                            });
                                        },
                                        success: function (lay, index) {
                                            $('.ens').click(function () {
                                                var at = $(this).attr('at');
                                                if(at=='1'){
                                                    layer.msg('该人员正在工作中！',{icon:5});
                                                    return;
                                                }
                                                var isc = $(this).attr('isc');
                                                var aid = $(this).attr('aid');
                                                if (isc == '0') {
                                                    $(this).attr('isc', '1');
                                                    $(this).find('.icon-ls').addClass('icon-ls-act');
                                                } else {
                                                    $(this).attr('isc', '0');
                                                    $(this).find('.icon-ls').removeClass('icon-ls-act');
                                                }
                                            });
                                        }
                                    });
                                })
                            });

                            $('.moves').click(function () {
                                var aid = $(this).attr('aid');
                                var did = $(this).attr('did');
                                var tr = $(this).parent().parent();
                                layer.confirm('确认移除该人员吗?', {icon: 3, title:'提示'}, function(rin){
                                    var loading = layer.load(1, {shade: [0.1, '#fff']});
                                    $.post('{:url("remove")}',{dis_id:did,aid:aid},function (re) {
                                        layer.close(loading);
                                        if (re.code === 1) {
                                            layer.msg(re.msg, {time: 1000, icon: 1});
                                            tr.remove();
                                        } else {
                                            layer.msg(re.msg, {time: 1000, icon: 2});
                                        }
                                        layer.close(rin);
                                        layer.close(index);
                                    });
                                });
                            });

                        }
                    });

                });

            }
            else if(obj.event == 'track'){

                $.post('{:url("track")}',{dis_id:data.id},function (dal) {
                    //跟踪状态列表
                    var str = '<table class="layui-table">';


                    $.each(dal.data,function (k,v) {
                        if(k==0&&data.state_id==25){
                            str+=   '<tr>' +
                                '<th style="text-align: center"><i class="layui-icon layui-icon-loading layui-icon layui-anim layui-anim-rotate layui-anim-loop" style="font-size: 16px;color: #009688"></i></th>'+
                                '<td>'+v.c_time+'-【'+v.username+'】'+v.content+'</td>'+
                                '</tr>';
                        }else{
                            str+=   '<tr>' +
                                '<th style="text-align: center"><i class="layui-icon layui-icon-ok" style="font-size: 16px; color: #1aa094;"></i>  </th>'+
                                '<td>'+v.c_time+'-【'+v.username+'】'+v.content+'</td>'+
                                '</tr>';
                        }
                    });

                    if(dal.data.length<=0){
                        str+=   '<tr>' +
                            '<td style="text-align: center">跟踪列表为空</td>'+
                            '</tr>';
                    }


                    str += '</table>';
                    layer.open({
                        title:'任务跟踪',
                        btn:['关闭'],
                        area:['540px','460px'],
                        content:str,
                    });
                });

            }
        });


        $('#add').click(function () {
            location.href = '{:url("addUI")}';
        });
        $('#tak').click(function () {
            location.href = '{:url("meListUI")}';
        });
    });


    function sea(da,id) {
        for (var i=0;i<da.length;i++){
            if(id==da[i].admin_id)
                return true;
        }
        return false;
    }

</script>